<template>
	<view class="pt-images-verification">
		<pt-images-verification  :left="codeObj.left" :bgImg="codeObj.bgImg" :maskImg="codeObj.maskImg" @refresh="refresh" @success="success"></pt-images-verification>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 由于没有线上图片验证码库，这里就简单写两个
				codeArray: [{
					bgImg: require('@/static/safe/verify/code_1.jpg'),
					maskImg: require('@/static/safe/verify/code_1_cover.png'),
					left: 140 // 凹陷区距离背景图左边的距离
				},{
					bgImg: require('@/static/safe/verify/code_2.jpg'),
					maskImg: require('@/static/safe/verify/code_2_cover.png'),
					left: 230
				}],
				codeObj: {
					bgImg: '',
					maskImg: '',
					left: 0
				}
			}
		},
		onLoad() {
			this.init()
			
			
		},
		methods: {
			// 随机获取验证码，此处随机可能会随机到重复数据，按需修改
			init(){
				let index = this.random(0,this.codeArray.length - 1)
				this.codeObj = this.codeArray[index]
			},
			// 刷新验证码
			refresh(){
				this.init()
			},
			// 创建随机数
			random(mins,maxs){
				var randomNum = Math.round(Math.random() * (maxs - mins) + mins);
				return randomNum;
			},
			// 验证成功
			success(){
				uni.showToast({
					icon: 'success',
					title: '验证成功'
				})
		
				const eventChannel = this.getOpenerEventChannel()
				
				eventChannel.emit('acceptVerifyStatus', true)
				eventChannel.off('acceptVerifyStatus')
				
				setTimeout(() => {
					uni.navigateBack()
				}, 1000)
				
			}
		}
	}
</script>

<style>
	.pt-images-verification{
		padding-top: 30rpx;
	}
</style>
